ImageOptimを使って画像ファイルのサイズを小さくしてみる

#画像処理

津熊弘和

2013.04.10

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

スマホ向けに画像ファイルのサイズを小さくする

昨今LTEでアクセスができる端末が徐々に増えてきていますが、まだまだ3G回線を使った端末も残っているし、ガラケーも残っているのも現状です。とは言え画像をたくさん使ったサイトも多い。そのようなサイトは3G端末には厳しいですね。（ガラケーは画像変換してあげないとそもそも容量オーバーになってしまう）そこで少しでもファイルサイズを小さくしてアクセスしてくる端末に対してレスポンスよく応答するには提供側が考慮する必要があります。

CDNを使ったりスプライト画像を使うなど、やり方はさまざまですがImageOptimを使って静的画像ファイルであれば画質劣化させることなくファイルサイズそのものを小さく出来るようです。その小さくした画像ファイルをCDN等で配信すると更にレスポンスよく返せるかもしれませんね。まずはどれくらい小さくなるのかを検証してみようと思います。できる種類はPNG,JPEG,GIF animations。検証はPNGファイルでやってみます。不必要なコメントやカラーパレットのプロファイル情報を削除して小さくするみたいです

インストール

まずはダウンロードしてImageOptim.tbz2を適当な場所に保存します。（私はデフォルトの位置にダウンロードしました。）
ターミナルを開いてダウンロードした場所までカレントディレクトリを移動します。（現在はMAC版しかないようです）
Windowsの方はPNGGauntletで代用できるかもしれませんが未検証。

$ /Users/cm_tsukuma/Downloads
$ tar xvfz ImageOptim.tbz2

展開するとImageOptim.appができるので、それをアプリケーションフォルダにコピーしてインストールは完了（本日時点での最新バージョンは1.4.1）

さっそく変換してみる

適当なスクリーンショット画像ファイルで試してみました。
変換前は102KBあった画像ファイルをImageOptimで変換した結果77KBまでサイズが小さくなりました。
もう一つは75KBあった画像ファイルがImageOptimで変換した結果53KBまでサイズが小さくなりました。
それなりに小さくなってますね。画像ファイルが多ければ多いほど効果が見込める気がします。

変換の仕方はImageOptimを立ち上げて、ウィンドウに変換したい画像ファイルを直接Drag&Dropするかまたはコマンドラインからの起動もできます。（結局コマンドラインで実行するとアプリのウィンドウが立ち上がりますが）

コマンドラインの起動サンプル

$ open -a ImageOptim.app *.png ←変換したい画像ファイルを指定します。

変換後はサイズと節減率が表示されるので、どれくらい小さくなったかをその場で確認できます。（ちなみに返還前のサイズは75KBです）

元ファイルを残して変換したい場合はImageOptimの環境設定を開いて、ファイル保存前に元ファイルのバックアップをするにチェックしておきます。

まとめ

PCやスマホ等から直接Webサーバにアップロードされた画像ファイル等はサーバ側で処理をする必要がありますので、今回の適用範囲はあくまでも静的画像ファイルが対象になります。（サイト公開時に対応しておくと良いという位置づけ）
ImageMagicを使えば恐らくアップロードされた際、画像に埋め込まれたEXIF情報等をサーバ側処理として取り除けるはずなので、次はそちらを検証してみたいと思います。（サイトを継続運用していく上で対応しておくと良いという位置づけ）
あくまで主観です。。。